﻿<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%><%@taglib
	prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="zh-cn">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="viewport"
			content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>在线报名</title>
		<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<!--[if lt IE 9]> <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>  <![endif]-->
		<style>
			@media screen and (max-width:800px){.alert-tip{display:block !important;}}
		</style>
	</head>
	<body>
		<jsp:include page="pg_header.jsp"></jsp:include>
		<div class="container-fluid">
		<div class="alert alert-success alert-tip" role="alert" style="display:none; background-color: #dff0d8;     border-color: #d6e9c6;     color: #3c763d;border-radius: 4px;     margin-bottom: 20px;     padding: 15px;">
      <strong>提示 : </strong>手机用户点击右上角查询所有报名</div>
			<img width="100%" height="" src="${site.picPath }"
				class="header-image" alt="">
			<div class="row">
				<div class="col-sm-8 blog-main">
					<c:forEach items="${articles}" var="article" varStatus="state">
						<div class="blog-post">
							<h2 class="blog-post-title" style="cursor: pointer;"
								data-toggle="modal" data-target="#a${article.id }">
								${article.title}
							</h2>
							${article.describes }
							<hr>
						</div>
						<div class="modal fade" id="a${article.id }" tabindex="-1"
							role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal">
											<span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
										</button>
										<h4 class="modal-title" id="myModalLabel">
											${article.title}
										</h4>
									</div>
									<div class="modal-body">
										${article.content }
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-default"
											data-dismiss="modal">
											关闭
										</button>
									</div>
								</div>
							</div>
						</div>
					</c:forEach>
					<jsp:include page="pager.jsp"></jsp:include>
				</div>
				<jsp:include page="singup_left.jsp"></jsp:include>
			</div>
		</div>
		<script src="bootstrap/js/bt_jquery.js"></script>
		<script src="bootstrap/js/bootstrap.min.js"></script><jsp:include
			page="singup_footer.jsp"></jsp:include>
	</body>
</html>

